<template>
  <el-dialog
    label-width="80px"
    title="添加合同"
    :visible.sync="dialogVisible"
    append-to-body
    width="40%">
    <el-form :model="form" ref="form" :rules="rules">
      <el-row :gutter="10">
        <el-col :span="8">
          <el-form-item label="客户手机号" prop="phone">
            <el-input label="客户手机号" v-model="form.phone"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="合同编号" prop="contractNo">
            <el-input label="合同编号" v-model="form.contractNo"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="8">
          <el-form-item label="邮箱" prop="email">
            <el-input label="邮箱" v-model="form.email"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="10">
        <el-col :span="24">
          <el-form-item prop="fileName" label="上传文件">
            <file-upload ref="fileUpload"
                         :limit="1"
                         :fileSize="5"
                         :fileType="['pdf']"
                         @input="handleInput"
            ></file-upload>
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button @click="dialogVisible = false">取 消</el-button>
      <el-button type="primary" @click="submitForm">确 定</el-button>
    </span>
  </el-dialog>
</template>

<script>
  import FileUpload from '@/components/FileUpload';
  import {transform} from "../../../../api/crm/businessTrack";

  export default {
    name: "transform",
    props: {
      businessId: {type: [String, Number]},
    },
    components: {FileUpload},
    data() {
      return {
        // 商机Id
        id: this.businessId,
        dialogVisible: false,
        // 表单
        form: {},
        //  表单验证
        rules: {
          phone: [{required: true, message: '手机号不能为空', trigger: 'blur'}],
          contractNo: [{required: true, message: '合同不能为空', trigger: 'blur'}],
          fileName: [{required: true, message: '上传文件不能为空', trigger: 'blur'}],
          email: [{required: true, message: '邮箱不能为空', trigger: 'blur'}],
        },
      }
    },
    created() {
    },
    methods: {
      // 确定
      submitForm() {
        this.$refs.form.validate(valid => {
          if (valid) {
            this.form.record = '商机转客户';
            transform(this.id, this.form).then(resp => {
              this.$message.success('成功');
              this.$emit('success');
              this.dialogVisible = false;
            })
          }
        })
      },
      // 上传文件
      handleInput(urls) {
        this.form.fileName = urls;
      },
      //  重置
      resetForm() {
        this.form = {
          id: this.businessId,
          phone: null,
          contractNo: null,
          fileName: null,
          email: null,
        }
      },
    }
  }
</script>

<style scoped>

</style>
